iT邦幫忙

2021 iThome 鐵人賽

DAY 22
0
Modern Web

以 React 為主的那些前端事系列 第 22

Day 22 - Memorized Hook: useMemo

  • 分享至 

  • xImage
  •  

...> 如果有錯誤,歡迎留言指教~ Q_Q 沒寫完啦

useMemo

回傳一個 memoized 的值。

記住 return value 的 useMemo,做快取加速用途

const memoizedValue = useMemo(() => computeExpensiveValue(a, b), [a, b]);

傳遞一個「建立」function 及依賴 array。

只會在依賴改變時才重新計算。

如果沒有提供依賴 array,那每次 render 時都會計算新的值。

這點跟 useEffect 很像,但是不要在 useMemo 做一些通常不會在 render 期間做的事情。

使用時機: 遇到複雜耗時計算時使用,

把計算好的結果存起來,用來比對何時該重新計算

每次 render 時,去比對依賴的值是否更改

過度使用,會影響效能

如果你的計算很單純簡單,那就不要用咧

ref:

  1. https://www.infoq.cn/article/mm5btiwipppnpjhjqgtr

上一篇
Day 21 - Memorized Hook: useCallback
下一篇
Day 23 - Redux middleware 介入處理非同步
系列文
以 React 為主的那些前端事30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言